import React, { Component } from 'react';
import { Link } from "react-router-dom"
import './item.css'
class Item extends Component {
    constructor(props) {
        super(props)
        this.state = {
            items: this.props.data
        }
    }
    render() {
        const ListItem = this.props.data.map(item => {
            return (
                <Link to={`/musicDetail?id=${item.id}`}>
                    <div key={item.id} className='content'>
                        <img src={item.coverImgUrl} alt="" />
                        <div>{item.name}</div>
                    </div>
                </Link>
            )
        })
        return (
            <div className='container'>
                {ListItem}

            </div>
        );

        }
}

export default Item;
